import Taro, {Component} from '@tarojs/taro'
import {View, Text} from '@tarojs/components'

import {
  AtInput
} from 'taro-ui'

import './bindMobile.scss'
import DataManager from "../../utils/DataManager";
import {STORAGE_KEY} from "../../utils/const";

import {base_url} from "../../network/config";

export default class bindMobile extends Component{

  config = {
    navigationBarTitleText: '绑定手机号'
  }

  onPullDownRefresh(){
    Taro.stopPullDownRefresh();
  }

  constructor(props) {
    super(props)
    this.state = {
      inputMobileNumber : '',
      inputMobileCode : '',
      sendCodeEnable:true,
      time:'点击发送    '
    }
  }

  onMobileChange = (mobile) =>{
    this.setState({
      inputMobileNumber:mobile
    })
  }

  onCodeChange = (code) =>{
    this.setState({
      inputMobileCode:code
    })
  }

  onSendCodeClick = () =>{
    let _this = this;
    if (this.state.sendCodeEnable) {
      this.setState({sendCodeEnable : false});
      let mills = 10;
      let time = setInterval(()=>{
        mills --;
        _this.setState({
          time : mills + 's'
        })
        if(mills == 0){
          clearInterval(time)
          _this.setState({
            time : '重新发送',
            sendCodeEnable : true
          })
        }
      },1000)
    }
  }

  onSubmitClick = () =>{
    if (!this.state.inputMobileNumber){
      Taro.showToast({
        title:'请填写手机号',
        icon:'none'
      })
      return;
    }

    let _this = this;
    Taro.request({
      url:base_url + 'rest/user/userBindMobile',
      data:{
        token:DataManager.getToken(),
        platform:'android_c',
        weixinId:DataManager.getWeiXinId(),
        loginChannel:'wechat',
        appId:'KC876D98B30UA40CJSNHI689FB33SDW',
        digest : 'dda484557c12febe48139d8f44051c13',
        mobile:_this.state.inputMobileNumber
      },
      header: { 'content-type': 'application/x-www-form-urlencoded' },
      method: 'POST',
      success(res2) {
        console.log('bind=========]' + JSON.stringify(res2))
        if (res2.data.status == 'success'){
          Taro.setStorageSync(STORAGE_KEY.MOBILE , _this.state.inputMobileNumber);
          Taro.setStorageSync(STORAGE_KEY.IS_BIND_MOBILE , 1);
          Taro.navigateBack({
            delta : 1
          })
         } else {
          Taro.showToast({
            title:res2.data.message,
            icon:'none'
          })
        }
      }
    })
  }

  render(){
    return(
      <View className='bind-mobile-container'>
        <View className='bind-mobile-hint-container'>
          <Text className='bind-mobile-hint-text'>绑定手机后不可修改</Text>
        </View>
        <View className='bind-mobile-input-area'>
          <AtInput
            style='max-lines:1;height:45px;margin-left: 20px;'
            name='mobileNumber'
            value={this.state.inputMobileNumber}
            clear
            title='手机号'
            type='phone'
            placeholder='请填写手机号码'
            border
            maxlength={11}
            onChange={this.onMobileChange.bind(this)}
          />
        </View>
        <View className='bind-mobile-commit-container' onClick={this.onSubmitClick.bind(this)}>
          <Text className='bind-mobile-commit-text'>提交</Text>
        </View>
      </View>
    )
  }

}




